<template>
	<view class="solid-top" style="position: fixed; bottom: 0px;width: 100%;">
		<view class="cu-bar tabbar bg-white text-gray">
			
			<view v-for="(item,index) in data" :key="index" class="action" :class="index==TabCar ? 'color' : 'text-gray' " @click="tabto(index)">
				<view :class="index==TabCar ? item.iconfill : item.icon"></view>
				<view>{{item.text}}</view>
			</view>
			
		</view>
	</view>
</template>

<script>
	export default {
		name:'bottom-bar',
		props: {
			TabCar: { //内容区域是否通栏
				type: String,
				default: ''
			},
			TextColor: { //内容区域是否通栏
				type: String,
				default: ''
			}
		},
		
		data() {
			return {				
				data: [{
					icon : 'cuIcon-like',
					iconfill : 'cuIcon-likefill',
					text : '书架',
					name:'index'
				},{
					icon : 'cuIcon-same',
					iconfill : 'cuIcon-samefill',
					text : '书城',
					name:'concourse'
				},{
					icon : 'cuIcon-newshot',
					iconfill : 'cuIcon-newshotfill',
					text : '分类',
					name:'catalogue'
				}
				,{
					icon : 'cuIcon-my',
					iconfill : 'cuIcon-myfill',
					text : '我的',
					name:'my'
				}
				],
				// TabCar : 0
				
			};
		},
		
		methods: {
			tabto(e) {
				var name = this.data[e].name
				uni.switchTab({
					url: '/pages/'+name+'/'+name
				});
			}
			
		},
	}
	
</script>

<style>
	.color {
		color: #75b1ec;
	}

</style>
